import { Button, Col, DatePicker, Drawer, Form, Input, Row, Select, Tabs } from "antd";
import TextArea from "antd/es/input/TextArea";
import { WmsWarehouse } from "../warehouse/entity";
import warehouseService from "@/api/services/wms/warehouseService";
import { toast } from "sonner";
import { useEffect, useRef, useState } from "react";
import ReceiptMaterialPage, { ReceiptMaterialHandles } from "./ReceiptMaterial";
import { WmsPurchaseReceipt } from "./entity";
import dayjs from "dayjs";
import useDictionary from "@/hooks/system/useDictionary";

interface WmsPurchaseReceiptDrawerProps {
	isView?: boolean;
	parentId?: React.Key;
	formData: WmsPurchaseReceipt | null;
	drawerVisible: boolean;
	handleDrawerClose: () => void;
}

const WmsPurchaseReceiptDrawer: React.FC<WmsPurchaseReceiptDrawerProps> = ({
	isView,
	parentId,
	formData,
	drawerVisible,
	handleDrawerClose,
}) => {
	const [warehouseList, setWarehouseList] = useState<WmsWarehouse[]>([]);
	const [submitLoading, setSubmitLoading] = useState(false);

	const [form] = Form.useForm();
	const receiptMaterialRef = useRef<ReceiptMaterialHandles>(null);

	const orderStatusOptions = useDictionary("purchase_receipt_status");

	// 获取仓库下拉数据
	const getWarehouseList = async () => {
		await warehouseService
			.selectList()
			.then((res) => {
				setWarehouseList(res);
			})
			.catch((error) => {
				console.error(error);
				toast.error("加载仓库数据失败！");
			});
	};

	useEffect(() => {
		getWarehouseList();

		console.log("表单数据", formData);
		if (formData) {
			form.setFieldsValue({
				...formData,
				receiptDate: formData.receiptDate ? dayjs(formData.receiptDate) : undefined,
			});
		}
	}, [parentId]);

	const handleSubmit = async (values: WmsPurchaseReceipt) => {
		if (!parentId) {
			toast.error("缺少必要参数，无法提交表单");
			return;
		}

		setSubmitLoading(false);
	};

	return (
		<Drawer
			title="来料接收"
			width={900}
			open={drawerVisible}
			onClose={handleDrawerClose}
			footer={
				<div className="flex justify-end gap-2">
					<Button onClick={handleDrawerClose}>取消</Button>
				</div>
			}
		>
			<Form form={form} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }} onFinish={handleSubmit} disabled={isView}>
				<Row gutter={24}>
					<Col span={12}>
						<Form.Item name="receiptCode" label="收料单编号">
							<Input placeholder="编号自动生成" disabled />
						</Form.Item>
					</Col>
					<Col span={12}>
						<Form.Item name="purchaseOrderId" label="采购订单号" hidden>
							<Input />
						</Form.Item>
						<Form.Item name="purchaseOrderCode" label="采购订单号">
							<Input placeholder="编号自动生成" disabled />
						</Form.Item>
					</Col>
				</Row>
				<Row gutter={24}>
					<Col span={12}>
						<Form.Item name="supplierId" label="供应商" hidden>
							<Input />
						</Form.Item>
						<Form.Item name="supplierName" label="供应商">
							<Input disabled />
						</Form.Item>
					</Col>
					<Col span={12}>
						<Form.Item name="warehouseId" label="仓库">
							<Select
								options={warehouseList.map((item) => ({
									label: item.name,
									value: item.id,
								}))}
								allowClear
							/>
						</Form.Item>
					</Col>
				</Row>
				<Row gutter={24}>
					<Col span={12}>
						<Form.Item name="receiptDate" label="入库日期">
							<DatePicker style={{ width: "100%" }} onChange={(date, dateString) => dateString} />
						</Form.Item>
					</Col>
					<Col span={12}>
						<Form.Item name="status" label="单据状态">
							<Select options={orderStatusOptions} disabled />
						</Form.Item>
					</Col>
				</Row>
				<Row gutter={24}>
					<Col span={24}>
						<Form.Item name="remark" label="备注" labelCol={{ span: 3 }} wrapperCol={{ span: 21 }}>
							<TextArea />
						</Form.Item>
					</Col>
				</Row>

				<Tabs
					defaultActiveKey="1"
					items={[
						{
							key: "1  ",
							label: "收料明细",
							children: <ReceiptMaterialPage ref={receiptMaterialRef} parentId={parentId} />,
						},
					]}
				/>
			</Form>
		</Drawer>
	);
};

export default WmsPurchaseReceiptDrawer;
